<template>
    <el-dialog :title="dialog.type === 'edit' ? '编辑项目' : dialog.type === 'new' ? '新增项目' : '项目信息'"
        :visible.sync="dialog.show">
        <el-form ref="cashReceiptsForm" v-if="editData" :model="editData" :rules="rules">
            <el-form-item label="手机号：" :label-width="formLabelWidth" prop="cellPhoneNumber">
                <el-input v-model="editData.cellPhoneNumber" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="收款金额：" :label-width="formLabelWidth" prop="amountCollected">
                <el-input v-model.number="editData.amountCollected" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="收款方式：" :label-width="formLabelWidth" prop="paymentMethod">
                <el-radio-group v-show="['new', 'edit'].includes(dialog.type) || editData.paymentMethod === '现金'" v-model="editData.paymentType">
                    <el-radio :label="0">现金</el-radio>
                    <el-radio :label="1">其他</el-radio>
                </el-radio-group>
                <el-input v-show="editData.paymentType === 1" v-model="editData.paymentMethod" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="描述/说明：" :label-width="formLabelWidth" prop="illustrate">
                <el-input type="textarea" :autosize="{ minRows: 4 }" v-model="editData.illustrate"
                    autocomplete="off"></el-input>
            </el-form-item>

        </el-form>
        <!-- 现金，其他 -->
        <div slot="footer" class="dialog-footer">
            <el-button @click="handleClone">取 消</el-button>
            <el-button v-if="dialog.type === 'edit'" type="primary" @click="handleEditOk">提交</el-button>
            <el-button v-if="dialog.type === 'new'" type="primary" @click="handleAddOk">提交</el-button>
        </div>
    </el-dialog>
</template>
<script>
import { cashReceiptsAdd, cashReceiptsEdit } from '@/api/finance/cashReceipts'
export default {
    props: {
        parm: {
            type: Object,
            default: null
        }
    },
    data() {
        var validatorPhone = (rule, value, callback) => {
            if (value === '') {
                callback(new Error('手机号不能为空'))
            } else if (!/^1\d{10}$/.test(value)) {
                callback(new Error('手机号格式错误'))
            } else {
                callback()
            }
        }
        var validatorAmountCollected = (rule, value, callback) => {
            if (value === '') {
                callback(new Error('收款金额不能为空'))
            } else if (!Number.isInteger(value)) {
                callback(new Error('请输入数字值'));
            } else {
                callback()
            }
        }
        return {
            dialog: {
                show: this.parm ? this.parm.drawerShow : false,
                type: this.parm ? this.parm.drawerType : 'read', // edit || read || new
            },
            editData: this.parm ? this.parm.editData : {},
            formLabelWidth: '120px',
            rules: {
                cellPhoneNumber: [
                    { required: true, validator: validatorPhone, trigger: 'blur' },
                ],
                amountCollected: [
                    { required: true, validator: validatorAmountCollected, trigger: 'blur' },
                ]
            },
        }
    },
    methods: {
        authUser(obj) {
            let roles = this.$store.state.user.roles
            let data = obj
            if (!roles.includes('admin')) {
                if (roles.includes('1')) {
                    data.enterpriseId = this.presentEnterprise.enterpriseId
                } else {
                    data.enterpriseId = this.presentEnterprise.enterpriseId
                    data.stationId = this.presentSation
                }
            }
            return data
        },
        handleClone() {
            this.dialog.show = false
        },
        handleAddOk() {
            this.$refs['cashReceiptsForm'].validate((valid) => {
                if (valid) {
                    if (this.editData.paymentType === 0) {
                        this.editData.paymentMethod = '现金'
                    }
                    let editData = this.authUser(this.editData)
                    cashReceiptsAdd(editData).then(res => {
                        if (res && res.code === 200) {
                            this.$message.success(res.msg);
                            this.dialog.show = false
                            this.$emit('on-submit-add')
                        } else {
                            this.$message.error(res.msg);
                        }
                    })
                } else {
                    this.$message.warning('请填写必填项！！！');
                }
            });
        },
        handleEditOk() {
            console.log(this.editData);
            this.$refs['cashReceiptsForm'].validate((valid) => {
                if (valid) {
                    let editData = {
                        id: this.editData.id,
                        cellPhoneNumber: this.editData.cellPhoneNumber,
                        amountCollected: this.editData.amountCollected,
                        paymentType: this.editData.paymentType,
                        paymentMethod: this.editData.paymentMethod,
                        illustrate: this.editData.illustrate
                    }
                    if (editData.paymentType === 0) {
                        editData.paymentMethod = '现金'
                    }
                    cashReceiptsEdit(editData).then(res => {
                        if (res && res.code === 200) {
                            this.$message.success(res.msg);
                            this.dialog.show = false
                            this.$emit('on-submit-edit')
                        } else {
                            this.$message.error(res.msg);
                        }
                    })
                } else {
                    this.$message.warning('请填写必填项！！！');
                }
            });
        }
    },
    watch: {
        parm(newValue) {
            this.dialog.show = newValue.drawerShow;
            this.dialog.type = newValue.drawerType;
            this.editData = newValue.editData
        }
    }
}
</script>
<style scoped></style>
